﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>机构用户中心</title>
    <link href="../css/base.css" rel="stylesheet" />
    <!--字体图标-->
    <link href="../font/iconfont.css" rel="stylesheet" />
    <link href="../css/bootstarp.units.css" rel="stylesheet" />
    <link href="../css/InstitutPublic.css" rel="stylesheet" />
    <link href="../css/SiteManage.css" rel="stylesheet" />
</head>
<body>
    <div class="top">
        <div class="top-main">
            <div class="top_right">
                <ul>
                    <li class="mm">
                        <a href="javascript://"><b>机构平台</b></a><em></em>
                    </li>
                    <li class="ms">
                        <a href="javascript://"><i class="icon iconfont">&#xe600;</i><b>导航</b></a>
                        <div class="xialaBox">
                            <div class="fleft xl">
                                <h5>文化分类</h5>
                                <div class="nav-list">
                                    <p><a href="javascript://">亲子活动</a></p>
                                    <p><a href="javascript://">公益活动</a></p>
                                    <p><a href="javascript://">展览展会</a></p>
                                    <p><a href="javascript://">名家讲坛</a></p>
                                    <p><a href="javascript://">技术研讨</a></p>
                                    <p><a href="javascript://">全名可普</a></p>
                                </div>
                            </div>
                            <div class="fleft xr">
                                <h6><a href="javascript://">活动讲座</a></h6>
                                <h6><a href="javascript://">文化资源</a></h6>
                                <h6><a href="javascript://">场馆预约</a></h6>
                                <h6><a href="javascript://">机构广场</a></h6>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="top_left">欢迎你，小芝麻<a href="javascript://">退出</a></div>
        </div>
    </div>
    <div class="head">
        <a href="javascript://" class="logos"><img src="../images/org-logo.jpg"/></a>
    </div>
    <div class="content" id="content">
        <div class="leftNav" id="leftNav">
            <ul>
                <li><a href="../organization/InstitutUserC.html">机构主页</a></li>
                <li><a href="../organization/InstitutMessage.html">机构信息</a></li>
                <li class="current"><a href="../organization/SiteManage.html">场地管理</a></li>
                <li><a href="../organization/ActivityManage.html">活动管理</a></li>
                <li><a href="../organization/MemberManage.html">成员管理</a></li>
                <li><a href="../organization/VenueRental.html">场地出租</a></li>
                <li><a href="../user/UserManage.html">用户管理</a></li>
                <li><a href="../organization/NotificatMessage.html">通知消息</a></li>
                <li><a href="../organization/StateMessage.html">统计管理</a></li>
                <li><a href="../organization/AuthorityMessage.html">权限管理</a></li>
                <li><a href="../organization/Announcements.html">公告管理</a></li>
                <li><a href="../organization/MaterialDesign.html">物料设计</a></li>
                <li><a href="../organization/CulturalResources.html">文化资源</a></li>
            </ul>
        </div>
        <div class="rightCont">
            <div class="right_head">
                <p>
                    <a href="javascript://"><i class="icon iconfont">&#xe604;</i></a>
                    <b></b>
                    <a href="javascript://">注销</a>
                </p>
                场地管理中心
            </div>

            <div id="cnt" class="silde-content">
                <!-- 右边内容主体块 -->
                <div class="jg_title">
                    <a href="javascript://" onclick="addarena()" class="click-link">新建场地</a>
                    <h1>场地管理</h1>
                    <p>创建，管理机构内场地信息</p>
                </div>
                <div class="arena cont">
                    <div class="col-arena">
                        <h2>绍兴图书馆镜湖新馆<small>绍兴市越城区镜湖新区洋江西路</small><a class="click-link" href="javascript:;">修改</a></h2>
                        <div id="site_1" class="thums site clearfix">
                            <div class="thum">
                                <div class="ins">
                                    <h3>报告厅</h3>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">楼层：</label>
                                        <b class="label-body">1F</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">座位数：</label>
                                        <b class="label-body">120</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">面积：</label>
                                        <b class="label-body">120㎡</b>
                                    </div>
                                    <div class="label-dlt label-device">
                                        <label class="label-left pull-left">面积：</label>
                                        <div class="label-body">
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                        </div>
                                    </div>
                                </div>
                                <a href="javascript://" class="closes">×</a>
                            </div>
                            <div class="thum">
                                <div class="ins">
                                    <h3>报告厅</h3>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">楼层：</label>
                                        <b class="label-body">1F</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">座位数：</label>
                                        <b class="label-body">120</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">面积：</label>
                                        <b class="label-body">120㎡</b>
                                    </div>
                                    <div class="label-dlt label-device">
                                        <label class="label-left pull-left">面积：</label>
                                        <div class="label-body">
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                        </div>
                                    </div>
                                </div>
                                <a href="javascript://" class="closes">×</a>
                            </div>
                            <div class="thum">
                                <div class="ins">
                                    <h3>报告厅</h3>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">楼层：</label>
                                        <b class="label-body">1F</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">座位数：</label>
                                        <b class="label-body">120</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">面积：</label>
                                        <b class="label-body">120㎡</b>
                                    </div>
                                    <div class="label-dlt label-device">
                                        <label class="label-left pull-left">面积：</label>
                                        <div class="label-body">
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                        </div>
                                    </div>
                                </div>
                                <a href="javascript://" class="closes">×</a>
                            </div>
                            <div class="thum add-thum">
                                <a class="ins" href="javascript:;" onclick="add('site_1')"></a>
                            </div>
                        </div>
                    </div>
                    <div class="col-arena">
                        <h2>绍兴图书馆<small>绍兴市延安路</small><a class="click-link" href="javascript:;">修改</a></h2>
                        <div id="site_2" class="thums site clearfix">
                            <div class="thum">
                                <div class="ins">
                                    <h3>报告厅</h3>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">楼层：</label>
                                        <b class="label-body">1F</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">座位数：</label>
                                        <b class="label-body">120</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">面积：</label>
                                        <b class="label-body">120㎡</b>
                                    </div>
                                    <div class="label-dlt label-device">
                                        <label class="label-left pull-left">面积：</label>
                                        <div class="label-body">
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                        </div>
                                    </div>
                                </div>
                                <a href="javascript://" class="closes">×</a>
                            </div>
                            <div class="thum">
                                <div class="ins">
                                    <h3>报告厅</h3>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">楼层：</label>
                                        <b class="label-body">1F</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">座位数：</label>
                                        <b class="label-body">120</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">面积：</label>
                                        <b class="label-body">120㎡</b>
                                    </div>
                                    <div class="label-dlt label-device">
                                        <label class="label-left pull-left">面积：</label>
                                        <div class="label-body">
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                        </div>
                                    </div>
                                </div>
                                <a href="javascript://" class="closes">×</a>
                            </div>
                            <div class="thum">
                                <div class="ins">
                                    <h3>报告厅</h3>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">楼层：</label>
                                        <b class="label-body">1F</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">座位数：</label>
                                        <b class="label-body">120</b>
                                    </div>
                                    <div class="label-dlt">
                                        <label class="label-left pull-left">面积：</label>
                                        <b class="label-body">120㎡</b>
                                    </div>
                                    <div class="label-dlt label-device">
                                        <label class="label-left pull-left">面积：</label>
                                        <div class="label-body">
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                            <span class="badge">麦克风</span>
                                        </div>
                                    </div>
                                </div>
                                <a href="javascript://" class="closes">×</a>
                            </div>
                            <div class="thum add-thum">
                                <a class="ins" href="javascript:;" onclick="add('site_1')"></a>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 新建场馆块 -->
            </div>
            <div id="add" style="display:none;">
                <div class="jg_title">
                    <a class="click-link pull-right" href="javascript://" onclick="off()">取消</a>
                    <h1>新建场地</h1>
                    <p>设置场地基本信息，示意图</p>
                </div>
                <div class="layer-body adds form-horizontal" id="edit-box">
                    <button type="button"  class="btn fright" id="basic-edit" onclick="basic()">编辑</button>
                    <h3><i class="icon">1</i>基本信息</h3>
                    <fieldset class="form-body">
                        <div class="form-group">
                            <label class="control-label">场地名称：</label>
                            <div class="controls">
                                <input type="text" class="form-control col-md-3"  placeholder="报告厅" disabled="disabled" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label">场地面积：</label>
                            <div class="controls">
                                <input type="text" class="form-control col-md-1"placeholder="100" disabled="disabled"/>
                                <span class="help-block">㎡</span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label">所在楼层：</label>
                            <div class="controls">
                                <input type="text" class="form-control col-md-1"placeholder="3" disabled="disabled"/>
                                <span class="help-block">F</span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label">包含设备：</label>
                            <div class="controls form-control-static" id="devicebox">
                                <label class="checkbox-inline"> <input type="checkbox" value="option1" disabled="disabled">麦克风</label>
                                <label class="checkbox-inline"> <input type="checkbox" value="option1" disabled="disabled">空调</label>
                                <label class="checkbox-inline"> <input type="checkbox" value="option1" disabled="disabled">音响</label>
                                <label class="checkbox-inline"> <input type="checkbox" value="option1" disabled="disabled">讲台</label>
                                <label class="checkbox-inline"> <input type="checkbox" value="option1" disabled="disabled">投影</label>
                                <label class="checkbox-inline"> <input type="checkbox" value="option1" disabled="disabled">灯光</label>
                                <a class="click-link" href="javascript:;" id="add-device" onclick="addinput()"  style="margin-left: 10px;">添加</a>

                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label">场地类型：</label>
                            <div class="controls form-control-static">
                                <label class="checkbox-inline"> <input type="checkbox" value="option1" disabled="disabled">报告厅/放映厅</label>
                                <label class="checkbox-inline"> <input type="checkbox" value="option1" disabled="disabled">一人一座</label>
                                <label class="checkbox-inline"> <input type="checkbox" value="option1" disabled="disabled">活动空间</label>
                                <label class="checkbox-inline"><input type="text" class="form-control col-md-1" placeholder="容纳人数" style="font-size: 12px;height:16px; padding: 2px 6px;"></label>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label">图片展示：</label>
                            <div class="controls">
                                <div class="file_upload">
                                    <span>拖拽文件或点击选择文件上传</span>
                                </div>
                            </div>
                        </div>
                        <hr />
                        <div id="edit" class="edit-site" style="display:none;">
                            <h3><i class="icon">2</i>场地图示</h3>
                            <button type="button"  class="btn fright" style="padding: 3px 20px 5px">编辑</button>
                            <div class="toolbar">
                                <div class="form-group">
                                    <div  class="tool fright">
                                    <a href="javascript://" class="tico"><img  src="../images/door.png"/></a>
                                    <a href="javascript://" class="tico"><img  src="../images/door_u2152.png"/></a>
                                    <a href="javascript://" class="tico e"><img  src="../images/seat.png"/></a>
                                </div>
                                    <label class="control-label" style="width: 100px;margin-right: 5px;">区域大小：</label>
                                    <div class="controls">
                                        <span class="fleft" style="margin-left: 5px;">宽：</span>
                                        <input type="text" class="form-control col-md-1" placeholder=""/>
                                        <span class="fleft">高：</span>
                                        <input type="text" class="form-control col-md-1" placeholder="" />
                                        <button type="button"  class="btn fleft">创建</button>
                                        <span class="fleft" style="margin-left: 5px;">排序方式：</span>
                                        <div class="controls">
                                            <select class="form-control col-md-2">
                                                <option>左起始</option>
                                                <option>右起始</option>
                                            </select>
                                        </div>
                                     </div>

                                </div>
                            </div>
                            <div class="SketchMap">
                                <h6 class="MapTop"><span>舞台/银幕</span></h6>
                                <div class="column" style="display: none;">
                                    <input type="text" placeholder="1" />
                                    <input type="text" placeholder="2" />
                                    <input type="text" placeholder="3" />
                                    <input type="text" placeholder="4" />
                                    <input type="text" placeholder="5" />
                                    <input type="text" placeholder="6" />
                                    <input type="text" placeholder="7" />
                                    <input type="text" placeholder="8" />
                                    <input type="text" placeholder="9" />
                                    <input type="text" placeholder="10" />
                                    <input type="text" placeholder="11" />
                                    <input type="text" placeholder="12" />
                                    <input type="text" placeholder="13" />
                                    <input type="text" placeholder="14" />
                                </div>
                                <div class="PlaceMap">
                                    <div class="seatplace" style="width:660px; height: 300px;">
                                        <div class="seatIco"></div>
                                        <div class="seatIco seat"></div>
                                        <div class="seatIco door"></div>
                                        <div class="seatIco seat"></div>
                                        <div class="seatIco seat"></div>
                                        <div class="seatIco dingseat"></div>
                                        <div class="seatIco haveseat"></div>
                                        <div class="seatIco seat"></div>
                                    </div>
                                    <p class="SplitLine"></p>
                                </div>
                            </div>
                        </div>
                        <div class="form-group text-right">
                            <button type="button" id="keep" class="btn green" onclick="onkeep()">继续</button>
                            <button type="button" id="save" class="btn green" onclick="onsave(this)" data-ids="" style="display:none;">保存</button>
                        </div>
                    </fieldset>
                </div>
            </div>
        </div>
    </div>
    <!-- 新建场地块 -->
    <div id="addArena" style="display:none;">
        <div class="layer-body addArena form-horizontal">
            <h2 class="text-center">新建场馆</h2>
            <fieldset class="form-body">
                <div class="form-group">
                    <label class="control-label">场馆名称：</label>
                    <div class="controls">
                        <input type="text" class="form-control col-md-4"  />
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label">机构地址：</label>
                    <div class="controls clearfix">
                        <select class="form-control col-md-2">
                            <option>省</option>
                        </select>
                        <select class="form-control col-md-2">
                            <option>市</option>
                        </select>
                        <select class="form-control col-md-2">
                            <option>区</option>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label"></label>
                    <div class="controls clearfix">
                        <img src="../images/map-img.png" width="380" height="284" />
                    </div>
                </div>
                <div class="form-group text-center">
                    <button type="button" class="btn green">保存</button>
                </div>
            </fieldset>
        </div>
    </div>
    <script src="../js/jquery-1.9.1.min.js"></script>
    <script src="../plugins/layer/layer.js"></script>
    <script src="../js/animate.js"></script>
    <script type="text/javascript">
        var add = function (e) {
            $("#add").show().find("#save").attr("data-ids", e);
            $("#cnt").hide()
        };
        var off = function () {
            $("#add").hide()
            $("#cnt").show()
        }
        var addarena = function (e) {
            layer.open({
                type: 1,
                content: $("#addArena").html(),
                title: false,
                area: '700px'
            })
        };
        var keep = $("#keep");
        var save = $("#save");
        var edit = $("#edit");

        //基本信息编辑
        var basic=function () {
            $("#edit-box input[disabled=disabled]").attr("disabled",false);
        }


        //包含设备(添加/手动删除)
        var addinput=function () {
            if($(".inputtext").length==0){
                $("#add-device").before('<label class="checkbox-inline inputtext" style="position: relative;"><input type="text" class="form-control col-md-1" placeholder="" style="font-size: 12px;height:16px; padding: 2px 6px;" /> <a href="javascript://" class="close" onclick="removevalue()">×</a></label>')
            }
            else{return false;}
            //获取输入框内容,移除输入框,追加生成的新的设备文本,点击关闭移除设备
            var inputshutdown  = function () {
                $(document).unbind("click");
                var device = $(".inputtext input").val();
                $(".inputtext").remove();
                if(device.trim()!="")
                {
                    $("#add-device").before('<label class="checkbox-inline addnew">' + device + '<a href="javascript://" class="close" onclick="removevalue()">×</a></label>');
                }
                else{
                    return false;
                }
                //关闭
                $(".addnew .close").click(function () {
                    $(this).parent(".addnew").remove();
                })
            }
            //回车和点击空白调用addnew方法 和close方法
            $(".inputtext").keydown(function (e) {
                $(document).unbind("click");
                $(document).click(function () {
                    inputshutdown();
                })
                if (e.keyCode == 13) {
                    inputshutdown();
                }
            });
        }
        var removevalue=function () {
            $(".inputtext input").val("");
        }



        var onkeep = function () {
            keep.hide();
            save.show();
            edit.show();
        };
        var onsave = function (s) {
            var id = $(s).attr("data-ids");//获取指定场馆的id值
            //提交保存数据的逻辑
            console.log(id);

            keep.show();
            save.hide();
            edit.hide();
            off();
        }
        $(function () {
            //侧导航高度自适应
            onscrolls2();
        })
    </script>
</body>
</html>
